<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>BFC</title>
</head>

<body>
  <!-- BFC块级格式化上下文
  1、概念
  把bfc理解为元素的一种属性，只要元素拥有了这个属性 就可以变成一块独立的渲染区域 （类似id title class属性）
  容器内的 不会影响容器外的元素
  2、如何触法
  html根元素
  float不为none
  绝对定位
  display的取值
  overfloe不为visible

  3、作用/特性
    1、避免外边距的重叠
    2、清除浮动
    3、避免元素被浮动元素覆盖

  -->

</body>

</html>